import { createLocalVue, mount } from '@vue/test-utils';{{#if wantVuex}}
import Vuex, { Store } from 'vuex';
import { i18n } from '@/app/shared/plugins/i18n/i18n';
import {{ properCase componentName }} from './{{ properCase componentName }}.vue';
import { I{{ properCase componentName }}State } from '../state';
import { {{ properCase componentName }}Module } from '../module';{{/if}}

const localVue = createLocalVue();{{#if wantVuex}}

localVue.use(Vuex);{{/if}}

describe('{{ properCase componentName }}.vue', () => {
{{#if wantVuex}}
  let store: Store<I{{ properCase componentName }}State>;

  beforeEach(() => {
    store = new Vuex.Store({
      modules: {
        {{ camelCase moduleName }}: {{ properCase componentName }}Module,
      },
    } as any);
  });

{{/if}}  test('renders component', () => {
    const wrapper = mount<any>({{ properCase componentName }}, {
    {{#if wantVuex}}  store,
    {{/if}}  localVue,
      i18n,
      stubs: ['router-link'],
    });

    expect(wrapper.find('h1').text()).toBe('{{ properCase componentName }}');
  });
{{#if wantVuex}}

  test('should increment and decrement', () => {
    store.dispatch = jest.fn();
    const wrapper: any = mount<any>({{ properCase componentName }}, {
      store,
      localVue,
      i18n,
      stubs: ['router-link'],
    });

    wrapper.vm.increment();
    expect(store.dispatch).toHaveBeenCalledWith(`{{ camelCase componentName }}/increment`, undefined);

    wrapper.vm.decrement();
    expect(store.dispatch).toHaveBeenCalledWith(`{{ camelCase componentName }}/decrement`, undefined);
  });

  test('dispatches action on the server', () => {
    store.dispatch = jest.fn();

    {{ properCase componentName }}.prefetch({ store });

    expect(store.dispatch).toHaveBeenCalled();
    expect(store.dispatch).toHaveBeenCalledWith(`{{ camelCase moduleName }}/increment`);
  });
{{/if}}
});
